<template>
    <div class="report">
      <!-- 菜单风格一 -->
      <!--<van-row>-->
        <!--<van-col span="12"  style="border-right:1px solid #D9D9D9;-->
<!--border-bottom:1px solid #D9D9D9;padding:30px 0;" v-for="(item,index) in useList" :key="index" >-->
          <!--<van-button  @click="switchPath(item.url)" :style="{backgroundColor:item.bgColor}" style="padding:0 10px">-->
            <!--<i class="iconfont report-icon" :class="item.icon" ></i>-->
          <!--</van-button>-->
          <!--<p style="margin:2px;font-size:14px;">{{item.title}}</p>-->
        <!--</van-col>-->
      <!--</van-row>-->

      <van-row>
        <van-col span="12"  v-for="(item,index) in useList" :key="index" style="border-right:1px solid #D9D9D9;
border-bottom:1px solid #D9D9D9;background: #fff;">

          <van-button class="home-van-button"  @click="switchPath(item.url)">
            <div  class="report-icon-span">
              <i class="iconfont report-icon"  :class="item.icon" :style="{color:item.bgColor}"></i>
            </div>
            <p style="margin:2px;line-height: 20px;">{{item.title}}</p>
          </van-button>
        </van-col>
      </van-row>
      <!-- 菜单风格二 -->
      <!--<van-row>-->
        <!--<van-col span="8" style="margin:10px 0;" v-for="(item,index) in useList" :key="index">-->
          <!--<van-button style="background: #16B3E1;color:#fff;padding:0 10px;background: linear-gradient(skyblue,#16B3E1);border-radius: 8px;" @click="switchPath(item.url)">-->
            <!--<i class="iconfont" :class="item.icon" style="font-size:30px;color:#fff;"></i>-->
          <!--</van-button>-->
          <!--<p style="margin:2px;font-size:14px;">{{item.title}}</p>-->
        <!--</van-col>-->
      <!--</van-row>-->
    </div>
</template>

<script>

    export default {
        name: "report",
        data(){
          return {
            list:[
              {
                title:"会员消费分析",
                url:"memberConsumption",
                icon:"icon-Analysis",
                bgColor:'#FF586B',
              },
              {
                title:"会员分布分析",
                url:"memberDistribution",
                icon:"icon-tubiao-bingtu",
                bgColor:'#3C8DBC',
              },
              {
                title:"会员新增同比",
                url:"memberAdded",
                icon:"icon-Analysis",
                bgColor:'#FF586B',
              },
              {
                title:"店仓销售排行榜",
                url:"storeSalesRankings",
                icon:"icon-paihangbang",
                bgColor:'#60E0A2',
              },
              {
                title:"店员销售排行榜",
                url:"clerkSalesRankings",
                icon:"icon-paihangbang",
                bgColor:'#60E0A2',
              },
              {
                title:"商品进销汇总",
                url:"goodsImportSales",
                icon:"icon-drxx51",
                bgColor:'#A6C5F6',
              },
              {
                title:"商品销售排行",
                url:"goodsSaleRankings",
                icon:"icon-paihangbang",
                bgColor:'#60E0A2',
              },
              {
                title:"终端商品排行",
                url:"retailTerminalGoodsRankings",
                icon:"icon-zhongduan",
                bgColor:'#666887',
              },
              {
                title:"终端零售排行",
                url:"retailTerminalRankings",
                icon:"icon-zhongduan",
                bgColor:'#666887',
              }
            ],
            list2:[
              {
                title:"会员消费分析",
                url:"memberConsumption",
                icon:"icon-Analysis",
                bgColor:'#FF586B',
              },
              {
                title:"会员分布分析",
                url:"memberDistribution",
                icon:"icon-tubiao-bingtu",
                bgColor:'#3C8DBC',
              },
              {
                title:"会员新增同比",
                url:"memberAdded",
                icon:"icon-Analysis",
                bgColor:'#FF586B',
              },
              {
                title:"店仓销售排行榜",
                url:"storeSalesRankings",
                icon:"icon-paihangbang",
                bgColor:'#60E0A2',
              },
              {
                title:"店员销售排行榜",
                url:"clerkSalesRankings",
                icon:"icon-paihangbang",
                bgColor:'#60E0A2',
              },
              {
                title:"商品进销汇总",
                url:"goodsImportSales",
                icon:"icon-drxx51",
                bgColor:'#A6C5F6',
              },
              {
                title:"商品销售排行",
                url:"goodsSaleRankings",
                icon:"icon-paihangbang",
                bgColor:'#60E0A2',
              },
            ],
            useList:[],
            cols:3,
          }
        },
      methods:{
        switchPath(url){
          this.$router.push({ name: url});
        }
      },
      mounted(){
        var empId = localStorage.getItem('empId');
        // if (localStorage.getItem("type") == 1) {
        //   this.useList = this.list;
        // }else{
        //   this.useList = this.list2;
        // }

        if (!parseInt(empId)&&parseInt(localStorage.getItem("type")) == 1) {
          this.useList = this.list;
        }else if(!parseInt(empId)&&parseInt(localStorage.getItem("type"))!=1){
          this.useList = this.list2;
        }

        if(parseInt(empId)&&parseInt(localStorage.getItem("type"))==1){//代理商员工
          // console.log(999)
          this.useList = this.list;
        } else if (parseInt(empId)&&parseInt(localStorage.getItem("type"))!=1) {//经销商员工
          this.useList = this.list2;
        }
      }
    }
</script>

<style scoped>
  .report{
    margin-bottom:50px;
  }
  .report p{
    margin:0;
  }
  .report .iconfont{
    font-size:28px;
    color:skyblue;
  }
  a{
    color: unset;
  }
  .report-icon{
    font-size:36px!important;
    /*color:#fff!important;*/
  }
  .weui-grid:before{
    border-right:0;
  }
  .weui-grid:after{
    border-bottom: 0;
  }
  .report-icon-span{
    width:50px;
    margin:0 auto;
    padding: 5px 0;
  }
  .home-van-button{
    border-radius: 0;
    width:100%;
    padding:45px 0;
    border:0;
    height:auto;
    line-height: initial
  }
  @media (min-width: 768px) {
    .report-icon{
      font-size:50px!important;
    }
    .report-icon-span{
      width:50px;
      margin:0 auto;
      padding: 5px 10px;
    }
  }
</style>
